<link rel="stylesheet" href="../../styles/css/car_details.css">
<link rel="stylesheet" href="../../styles/css/car-details-responsive.css">
<div class="car-details-box">
    <div class="header">
        <div class="header_title">
            <div class="wheremycar light_blue text-center hidden">查看我的车辆</div>
            <div class="mileage_box">
                <div class="total_mileage">总里程：9999公里</div>
                <div class="mileage">里程：633.9公里</div>
            </div>
        </div>
        <div class="welcome_user light_blue text-center">欢迎您，小沈阳！</div>
    </div>
    <div class="container ">
        <div class="row ">
            <div class="col-lg-6 show_map_box">
                <img class="map_bg" src="../../styles/img/car_details/map_bg.png" alt="">
                <div class="map_container">
                    <div class="on_map_car">
                        <div id="findCar"></div>
                        <div id="r-result"></div>
                        <div class="search_box hidden">
                            <input type="text" id="search_ipt">
                            <button id="btn">确定</button>
                            <span id="spn1"></span> <span id="spn2">纬度:</span> <span id="spn3">地址:</span>
                        </div>
                    </div>
                    <div class="position_info_box">
                        <div class="car_location_info wathet_blue">
                            <p>车辆信息：路虎揽胜 （QBLHLS 00001）</p>
                            <p>车辆位置：<span class="car_addr"></span></p>
                            <p>数据时间：2018-03-08 15：30:30</p>
                            <p>费用：10000/天</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-6 the_owner_box">
                <div class="driver_info_box">
                    <div class="instrument_board_left"></div>
                    <div class="instrument_board_right"></div>
                    <div class="water_temperature_box">
                        <div class="cover_box">
                            <div class="water_temperature"></div>
                        </div>
                    </div>
                    <div class="r_pointer"></div>
                    <div class="oil_content">
                        <div class="cover_oil_box">
                            <div class="oil_box"></div>
                        </div>
                    </div>
                    <div class="v_pointer"></div>
                    <div class="v_speed">
                        <span>120</span>
                        <span>km/h</span>
                    </div>
                    <div class="temperature_date_box">
                        <span class="temperature">17℃</span>
                        <span class="date_box">2017/3/15</span>
                    </div>
                    <div class="owner_info_box left_owner_info_box">
                        <img class="big_photo" src="../../styles/img/car_details/car_owner_photo.png" alt="">
                        <img class="small_photo" src="../../styles/img/car_details/car_owner_photo.png" alt="">
                        <div class="owner_info wathet_blue">
                            <p>姓名：车主名</p>
                            <p>年龄：18</p>
                            <p>驾龄：8</p>
                            <p>特长：普通轿车/手动档轿车</p>
                            <p>费用：<span class="red-color">10000/天</span></p>
                        </div>
                    </div>
                </div>
                <div class="car_data_box">
                    <div class="data_thead table_top_bg white">
                        <span>当前车辆数据</span>
                        <a href="javascript:void(0)"> 查看车辆历史数据</a>
                    </div>
                    <table class="table table-bordered car_data_table">
                        <thead></thead>
                        <tbody>
                        <tr class="first_tr">
                            <td class="first_td"><p class="wathet_blue">温度</p></td>
                            <td></td>
                            <td>温度</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td class="first_td"><p class="wathet_blue">温度</p></td>
                            <td></td>
                            <td>湿度</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td class="first_td"><p class="wathet_blue">温度</p></td>
                            <td></td>
                            <td>湿度</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td class="first_td"><p class="wathet_blue">温度</p></td>
                            <td></td>
                            <td>湿度</td>
                            <td></td>
                        </tr>
                        <tr class="last_tr">
                            <td class="first_td"><p class="wathet_blue">温度</p></td>
                            <td></td>
                            <td>湿度</td>
                            <td></td>
                        </tr>
                        </tbody>
                    </table>
                    <div class="car_interior">
                        <img src="../../styles/img/car_details/car_interor_photo.jpg">
                       <!-- <div class="banner" id="banner">
                            <ul>
                                <li class="slider-item">
                                    <a href="javascript:void(0)">
                                        <img src="../../styles/img/car_details/car_interor_photo.jpg">
                                    </a>
                                </li>
                            </ul>
                            <div class="progress"></div>
                            <a href="javascript:void(0);" class="unslider-arrow04 prev">
                                <img class="arrow" id="al" src="../../styles/img/car_details/arrowl.png">
                            </a>
                            <a href="javascript:void(0);" class="unslider-arrow04 next">
                                <img class="arrow" id="ar" src="../../styles/img/car_details/arrowr.png">
                            </a>
                        </div>-->
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="footer">
        <a href="javascript:void(0)">查看车辆轨迹</a>
        <span>车管家 |  一站式车辆管理平台</span>
    </div>
</div>

